<template>
  <view class="box">
    <view class="box_1">
      <text>状态</text>
      <text class="box_1_wei">{{
              this.form.status == "1" ? "使用中" : "未分配"
            }}</text>
    </view>
    <view class="contain">
      <view v-for="item in list" :key="item.lable" class="contain_box">
        <view class="left"> {{ item.label }}</view>
        <view class="right">
          <text v-if="item.label === '所属部门'">{{
            getDriverDept(item.value)
          }}</text>
          <text v-else> {{ item.value }}</text>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
import { getDetail } from "@/api/vehiclemanagement";
export default {
  name: "cardetail",
  data() {
    return {
      list: [
        {
          label: "车牌号码",
          value: "",
        },
        {
          label: "所属部门",
          value: "",
        },
        {
          label: "核载人数",
          value: "",
        },
        {
          label: "停放地点",
          value: "",
        },
        {
          label: "车钥匙保管人",
          value: "",
        },
        {
          label: "备注",
          value: "",
        },
        {
          label: "车辆照片",
          value: "",
        },
        {
          label: "创建人",
          value: "",
        },
        {
          label: "创建时间",
          value: "",
        },
      ],
      row: {},
      form: {},
      deptList: [],
    };
  },

  async onLoad(options) {
    this.row = JSON.parse(options.row);
    this.deptList = JSON.parse(options.deptList);
    const res = await getDetail(this.row.id);
    this.form = res.data;
    this.list.forEach((item) => {
      if (item.label === "车牌号码") {
        item.value = this.form.carNumber;
      }
      if (item.label === "所属部门") {
        item.value = this.form.deptId;
      }
      if (item.label === "核载人数") {
        item.value = this.form.seats;
      }
      if (item.label === "停放地点") {
        item.value = this.form.parkingLocation;
      }
      if (item.label === "车钥匙保管人") {
        item.value = this.form.keeper;
      }
      if (item.label === "备注") {
        item.value = this.form.remarks;
      }
      if (item.label === "车辆照片") {
        item.value = this.form.carPhotoUrl;
      }
      if (item.label === "创建人") {
        item.value = this.form.createUser;
      }
      if (item.label === "创建时间") {
        item.value = this.form.createTime;
      }
    });
  },
  mounted() {},

  methods: {
    getDriverDept(val) {
      return this.deptList.find((item) => item.id === val)?.deptName;
    },
  },
};
</script>

<style lang="scss" scoped>
page {
  background-color: #f2f2f2;
}
.box {
  background-color: #f2f2f2;
  .box_1 {
    width: 100%;
    height: 70px;
    line-height: 70px;
    background-color: #fff;
    margin: 10px 0;
    padding-left: 15px;
    .box_1_wei {
      padding-left: 20%;
      color: #70b603;
    }
  }
}

.contain {
  background-color: #fff;
  width: 100%;
  //   height: 400px;
  padding: 10px;
  margin: 15px 0;
  .contain_box {
    padding: 10px 0;
    display: flex;
    flex-wrap: wrap;
    .left {
      flex: 1;
      color: #aaaaaa;
    }
    .right {
      flex: 4;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      margin-left: 30px;
    }
  }
}
.info {
  color: #aaaaaa;
  padding: 0 0 10px 0;
}
.info1 {
  padding: 10px 0;
}
</style>